import XtxSkeleton from './Skeleton/index.vue'
import XtxSlider from './Slider/index.vue'
import XtxMore from './More/index.vue'
import XtxBread from './Bread/index.vue'
import XtxBreadItem from './Bread/Item.vue'
import XtxCity from './City/index.vue'
import XtxCount from './Count/index.vue'
import XtxButton from './Button/index.vue'
import XtxCheckBox from './CheckBox/index.vue'
import XtxImageView from './ImageView/index.vue'
import XtxSku from './Sku/index.vue'
import XtxDialog from './Dialog/index.vue'
import XtxInfiniteLoad from './InfiniteLoad/index.vue'
import XtxTabs from './Tabs/index.vue'
import XtxTabPane from './Tabs/pane.vue'

// 统一出口和统一组件命名前缀，用户可以按需导入组件库的组件
// PS：按需导入后，有TS类型提示
export {
  XtxSkeleton,
  XtxSlider,
  XtxMore,
  XtxBread,
  XtxBreadItem,
  XtxCity,
  XtxCount,
  XtxButton,
  XtxCheckBox,
  XtxImageView,
  XtxSku,
  XtxDialog,
  XtxInfiniteLoad,
  XtxTabs,
  XtxTabPane
}

import type { Plugin, App } from 'vue'
// 问题：全局组件注册成功，但调用时没有TS类型提示
// 解决方案：为组件库创建对应的.d.ts类型声明文件
const XtxUI: Plugin = {
  // 安装组件库(插件)
  // app.use(XtxUI)的时候，就是调用插件的install方法，并且传递app实例过来
  install(app: App) {
    // 把组件库所有组件注册成全局组件
    app.component(`XtxSkeleton`, XtxSkeleton)
    app.component(`XtxSlider`, XtxSlider)
    app.component(`XtxMore`, XtxMore)
    app.component(`XtxBread`, XtxBread)
    app.component(`XtxBreadItem`, XtxBreadItem)
    app.component(`XtxImageView`, XtxImageView)
    app.component(`XtxCity`, XtxCity)
    app.component(`XtxSku`, XtxSku)
    app.component(`XtxCount`, XtxCount)
    app.component(`XtxButton`, XtxButton)
    app.component(`XtxCheckBox`, XtxCheckBox)
    app.component(`XtxDialog`, XtxDialog)
    app.component(`XtxTabs`, XtxTabs)
    app.component(`XtxTabPane`, XtxTabPane)
    app.component(`XtxInfiniteLoad`, XtxInfiniteLoad)
  }
}
// 默认导出组件库插件
export default XtxUI

// 导出Message消息提示组件的调用函数
export * from './Message/index'
